import { mapStyles } from '../config/mapStyles'
import xinjiang from "@/assets/data/mapJson/650000.json";
import { rander } from "./rander";
import MapboxDraw from '@mapbox/mapbox-gl-draw';
const initializationMapMgr = {
    // 初始化地图  containerId: 地图容器id, mapOptions: 地图配置项
    // mapOptions: { center: [116.4, 39.9], zoom: 2 , projection: 'globe'}
    initializationMap(containerId: string, mapOptions: any): any {
        // 设置默认地图选项
        const defaultOptions = {
            container: containerId, // 设置地图容器id
            style: mapStyles.onLineVectorMap, // 设置地图的样式
            antialias: true, // 启用抗锯齿

        };

        // 合并自定义选项
        const mapConfig = { ...defaultOptions, ...mapOptions };

        // 初始化地图
        const map = new mapboxgl.Map(mapConfig);
        // 禁用键盘快捷键
        map.keyboard.disable();
        // map.on('load', function() {
            // map.keyboard.enable();
            // map.getCanvas().focus();
        // });
        // const draw = new MapboxDraw({
        //     displayControlsDefault: false,
        //     // Select which mapbox-gl-draw control buttons to add to the map.
        //     controls: {
        //         polygon: true,
        //         trash: true
        //     },
        //     // Set mapbox-gl-draw to draw by default.
        //     // The user does not have to click the polygon control button first.
        //     defaultMode: 'draw_polygon'
        // });
        // map.addControl(draw);
        // this.addSkyBox(map);
        return map;

    },
    // 天空星星盒子
    addSkyBox(map: any) {
        // 在地图加载后配置天空效果
        map.on('load', function () {
            // 添加天空背景
            map.addLayer({
                'id': 'sky-layer',  // 层的ID
                'type': 'sky',  // 图层类型为 sky
                'paint': {
                    // 设置天空背景
                    'sky-type': 'gradient',  // 设置天空效果为渐变
                    'sky-gradient': [
                        'rgba(0, 0, 0, 1)',  // 起始颜色（黑色）
                        'rgba(0, 255, 255, 1)'  // 结束颜色（浅青色）
                    ],  // 设置渐变效果
                    'sky-atmosphere-color': '#000000',  // 设置大气层颜色（黑色）
                    'sky-atmosphere-halo-color': '#ffffff',  // 设置大气光晕的颜色（白色）
                    'sky-atmosphere-halo-radius': 1,  // 设置光晕的半径
                    'sky-atmosphere-sun-intensity': 0.1,  // 设置太阳光的强度
                    'sky-star-intensity': 0.5,  // 设置星星的强度（这里调整星星的数量和亮度）
                }
            });
        });
    },
    // 切换图层 map: 地图对象, style: 样式名称  darkSkyMap , gaodeMap
    changeMapStyle(map: any, mapType: string) {
        this.removeGeojson(map)
        map.setStyle(mapStyles[mapType]);
        this.loadGeojson(map)
    },
    // 改变2D/3D地图
    changeMapMode(map: any, mode: string) {
        this.removeGeojson(map)
        if (mode === '3D') {
            map.setProjection("globe"); // 设置地图为3D模式
        } else if (mode === '2D') {
            map.setProjection("mercator"); // 设置地图为2D模式
        } else {
            map.setProjection("mercator"); // 设置地图为2D模式
            map.setPitch(45); // 设置俯仰角为 45 度; 
        }
        this.loadGeojson(map)
    },
    // 加载行政区域,用于切换底图
    loadGeojson(map: any) {
        rander.boundManager.boundaryLine(map, 'testJIJLIN', xinjiang) // 加载行政区域
    },
    // 移除行政区域
    removeGeojson(map: any) {
        rander.boundManager.removeBoundaryLine(map, 'testJIJLIN') // 移除行政区域

    }

}

export { initializationMapMgr };